.navbar-container {
  @apply sticky top-0 z-50 h-16 bg-reco-bg-lightmode/60;
  @apply dark:bg-reco-bg-darkmode/60;

  &.has-border {
    @apply border-basic-bottom;
  }

  .navbar-inner {
    @apply flex items-center relative mx-auto px-6 max-w-screen-1.5xl w-full h-16;
  }

  &.navbar-container--has-series {
    @apply -top-16;
  }

  &.not-open {
    @apply backdrop-saturate-150 backdrop-blur-xl;
  }

  .navbar-links-wrapper {
    @apply absolute right-4 top-0 flex items-center h-16;
    white-space: nowrap;
    .navbar-links__item {
      > a, .dropdown-link__title {
        @apply h-14;
      }
    }
    .navbar-links {
      @apply hidden md:inline-flex items-center;
    }
    .btn-toggle-menus {
      @apply align-middle;
    }
  }

  .search-box,
  #docsearch-container {
    @apply align-middle;
  }

  .btn-toggle-dark-mode {
    @apply ml-4 hidden align-middle;
    @apply md:inline-block;
    height: 20px;
  }

  .btn-toggle-menus {
    @apply ml-3 inline-block align-middle;
    @apply md:hidden;
    height: 20px;
    svg {
      @apply block;
    }
  }
}
